<template>
	<view class="login" style="padding: 20rpx;">
		<view style="font-size: 50rpx;">快速登录/注册</view>
		<form @submit="onlogin">
			<div>
				<input type="text" placeholder="请输入账号" v-model="fromVaiue.account" name="account" />
			</div>
			<div>
				<input type="safe-password" placeholder="请输入密码" v-model="fromVaiue.password" name="password" />
			</div>
			<view>
				<button style="margin-top: 20rpx;" v-if="flag" formType="submit">登录</button>
				<button style="margin-top: 20rpx;" v-else @click="enroll()">注册</button>
			</view>
		</form>
		<!-- 登录或注册 -->
		<view style="font-size: 25rpx;color: #9c9c9c;">
			<text v-if="flag" @click="setflag">
				无账号？/点击注册
			</text>
			<text v-else @click="setflag">
				已有账号？/点击登录
			</text>
		</view>
	</view>
</template>

<script>
	import {
		mapMutations
	} from 'vuex';
	export default {
		data() {
			return {
				flag: true,
				loading: false,
				fromVaiue: {
					account: "",
					password: ""
				}
			}
		},
		methods: {
			setflag() {
				this.flag = !this.flag
			},
			//登录验证
			onlogin(e) {
				uniCloud.callFunction({
					name: 'user',
					data: {
						aname: this.fromVaiue.account,
						paw: this.fromVaiue.password
					}
				}).then(res => {
					if (res.result.data[0]) {
						uni.showToast({
							title: '登录成功',
							success: () => {
								console.log(e.detail.value)
								let account = e.detail.value.account
								let password = e.detail.value.password
								uni.request({
									url: `${this.$serverUrl}/login.php`,
									header: {
										"Content-Type": "application/x-www-form-urlencoded"
									},
									data: {
										"username": account,
										"password": password
									},
									method: "POST",
									success: (e) => {
										console.log(66, e)
										if (e.statusCode !== 200) {
											uni.showModal({
												content: "用户名密码错误！",
												showCancel: false
											});
											return;
										}
										if (e.data.code === 0) {
											this.login(e.data);
											uni.navigateBack();
										} else {
											uni.showModal({
												content: e.data.message,
												showCancel: false
											})
										}
									}
								})
							}
						})
					} else {
						uni.showToast({
							title: "账号或密码错误",
							icon: 'none'
						})
					}

				})
			},
			//这是一个方法
			...mapMutations(['login']),
			enroll() {
				uniCloud.callFunction({
					name: 'user',
					data: {
						aname: this.fromVaiue.account
					}
				}).then(res => {
					if (res.result.data[0]) {
						uni.showToast({
							title:'账号重复',
							icon:"none"
						})
					} else {
						uniCloud.callFunction({
							name: 'enroll',
							data: {
								aname: this.fromVaiue.account,
								paw: this.fromVaiue.password
							}
						}).then(res=>{
							console.log(res)
						})
					}
				})

			}
		}
	}
</script>

<style lang="scss" scoped>
	.login {
		input {
			height: 100rpx;
			width: 100%;
			border-radius: 40rpx;
			border: 1px solid #eee;
			margin-top: 20rpx;
			padding: 0 20rpx;
			box-sizing: border-box;
		}
	}
</style>